<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>修改试卷</title>
		<link rel="stylesheet" type="text/css" href="/ExamOnline/easyui/themes/default/easyui.css">
		<link rel="stylesheet" type="text/css" href="/ExamOnline/easyui/themes/icon.css">
		<script type="text/javascript" src="/ExamOnline/easyui/jquery.min.js"></script>
		<script type="text/javascript" src="/ExamOnline/easyui/jquery.easyui.min.js"></script>
		<style type="text/css">
		</style>
	</head>

	<body>
		<div class="easyui-panel"  data-options="cache:false" style="height:600px;padding:5px;background:#fafafa;">
		<div class="easyui-panel" title="添加试卷" style="width:100%; padding:10px">
			<form id="ff" method="post">
			<input type="hidden"  name="id"/>
	    	<table cellpadding="5">
	    		<tr>
	    			<td>试卷标题：</td>
	    			<td><input class="easyui-textbox" type="text" name="papername" data-options="required:true"></input></td>
	    			<td>考试时间:</td>
	    			<td><input class="easyui-textbox" type="text"   name="examtime" value="180" data-options="required:true" style="width:50px"></input>分钟</td>
	    			<td>总分:</td>
	    			<td><input class="easyui-textbox" type="text" name="totalscore" value="100" data-options="required:true" style="width:50px"></input></td>
	    			<td>及格分数:</td>
	    			<td><input class="easyui-textbox" type="text" name="passscore" value="60" data-options="required:true" style="width:50px"></input></td>
	    			<td><button class="easyui-linkbutton" type="button" onclick="submitForm()">确认修改</button></td>
	    		</tr>
	    	</table>
	    </form>
		</div>
		<div class="easyui-tabs" style="width:100%;" title="选择题目" data-options="tabPosition:'left',headerWidth:'55'">
			<div title="单选题" style="padding:10px;">
				<table id="dg1" width="100%" height="300"></table>
			</div>
			<div title="多选题" style="padding:10px">
				<table id="dg2" width="100%" height="300"></table>
			</div>
		</div>
		<table id="choosetb1" title="已选题目" class="easyui-datagrid" style="width:100%;height:400px;">
		</table>
		</div>
	</body>
	<script>
	
	
	$("#choosetb1").datagrid({
		rownumbers: 'true',
		autoRowHeight: 'false',
		method: 'get',
		fitColumns: 'true',
		singleSelect : 'true',
		columns : [ [ {
			field : 'qtitle',
			title : '题目',
			width : 400,
			formatter:function(value,row,index){
				return "<div style='height:40px;'>"+value+"</div>"
			}
		}, {
			field : 'qtype',
			title : '分类',
			width : 30,
			formatter:function(value,row,index){
				if(value==1){
					return "单选题";
				}else if(value==2){
					return "多选题";
				}
			}
		}, {
			field : 'stageid',
			title : '阶段',
			align : 'center',
			width : 30,
			formatter : function(value, row, index) {
				if (value == 1) {
					return "一阶段";
				} else if (value == 2) {
					return "二阶段";
				} else if (value == 3) {
					return "三阶段";
				} else if (value == 4) {
					return "四阶段";
				}
			}
		}, {
			field : 'createtime',
			title : '创建时间',
			align : 'center',
			width : 75,
			formatter : function(value, row, index) {
				var localtime = new Date(value);
				return localtime.toLocaleString();
			}
		}, {
			field : 'test',
			title : '操作',
			width : 75,
			align : 'center'
		} ] ],
		onLoadSuccess:function(data){
			console.log(data);
		}
	});
		
	var jq = top.jQuery;
	var pp = jq('#tabs').tabs('getTab',"修改试卷");
	var id = pp.panel('options').id;
	$.post("/ExamOnline/paper/get","id="+id,function(r){
		console.log(r);
		$("#ff").form("load", r);
		for(var i=0;i<r.qlist.length;i++){
			var test = '<a href="#" onclick="showValue(' + r.qlist[i].qid + ')">查看</a>&nbsp;<a href="#" onclick="deltopaper(' +  r.qlist[i].qid + ','+ r.qlist[i].qtype+')">取消添加</a>';
			r.qlist[i].test = test;
		}
		var data = {};
		data.total  = r.qlist.length;
		data.rows = r.qlist;
		$("#choosetb1").datagrid("loadData",data);
		var data1 = {};
		data1.total = r.radiolist.length;
		data1.rows = r.radiolist;
		$("#dg1").datagrid("loadData",data1);
		var data2 = {};
		data2.total = r.multiplelist.length;
		data2.rows = r.multiplelist;
		$("#dg2").datagrid("loadData",data2);
	});
	
		$("#dg1").datagrid({
			rownumbers: 'true',
			autoRowHeight: 'false',
			method: 'get',
			fitColumns: 'true',
			singleSelect : 'true',
			columns : [ [ {
				field : 'qtitle',
				title : '题目',
				width : 450,
				formatter:function(value,row,index){
					return "<div style='height:40px;'>"+value+"</div>"
				}
			}, {
				field : 'qtype',
				title : '分类',
				width : 30,
				formatter:function(value,row,index){
					if(value==1){
						return "单选题";
					}else if(value==2){
						return "多选题";
					}
				}
			}, {
				field : 'stageid',
				title : '阶段',
				align : 'center',
				width : 30,
				formatter : function(value, row, index) {
					if (value == 1) {
						return "一阶段";
					} else if (value == 2) {
						return "二阶段";
					} else if (value == 3) {
						return "三阶段";
					} else if (value == 4) {
						return "四阶段";
					}
				}
			}, {
				field : 'createtime',
				title : '创建时间',
				align : 'center',
				width : 75,
				formatter : function(value, row, index) {
					var localtime = new Date(value);
					return localtime.toLocaleString();
				}
			}, {
				field : 'test',
				title : '操作',
				align : 'center',
				formatter : formatOper1
			} ] ]
		});
		$("#dg2").datagrid({
			rownumbers: 'true',
			autoRowHeight: 'false',
			method: 'get',
			fitColumns: 'true',
			columns : [ [ {
				field : 'qtitle',
				title : '题目',
				width : 450,
				formatter:function(value,row,index){
					return "<div style='height:40px;'>"+value+"</div>"
				}
			}, {
				field : 'qtype',
				title : '分类',
				width : 30,
				formatter:function(value,row,index){
					if(value==1){
						return "单选题";
					}else if(value==2){
						return "多选题";
					}
				}
			}, {
				field : 'stageid',
				title : '阶段',
				align : 'center',
				width : 30,
				formatter : function(value, row, index) {
					if (value == 1) {
						return "一阶段";
					} else if (value == 2) {
						return "二阶段";
					} else if (value == 3) {
						return "三阶段";
					} else if (value == 4) {
						return "四阶段";
					}
				}
			}, {
				field : 'createtime',
				title : '创建时间',
				align : 'center',
				width : 75,
				formatter : function(value, row, index) {
					var localtime = new Date(value);
					
					return localtime.toLocaleString();
				}
			}, {
				field : 'test',
				title : '操作',
				align : 'center',
				formatter : formatOper2
			} ] ]
		});

		function formatOper1(val, row, index) {
			return '<a href="#" onclick="showValue(' + index + ')">查看</a>&nbsp;<a href="#" onclick="addtopaper1(' + row.qid + ')">添加到试卷</a>';
		}
		function formatOper2(val, row, index) {
			return '<a href="#" onclick="showValue(' + index + ')">查看</a>&nbsp;<a href="#" onclick="addtopaper2(' + row.qid + ')">添加到试卷</a>';
		}
		function showValue(id) {
			$.messager.alert('show', '功能尚未完成！');
		}
		function addtopaper1(qid){
			var rows = $("#dg1").datagrid("getRows");
			var row = findRow(rows,qid);
			var index = $("#dg1").datagrid("getRowIndex",row);
			var test = '<a href="#" onclick="showValue(' + index + ')">查看</a>&nbsp;<a href="#" onclick="deltopaper(' + row.qid + ','+row.qtype+')">取消添加</a>';
			row.test = test;
			$("#choosetb1").datagrid("appendRow",row);
			$("#dg1").datagrid("deleteRow",index);
		}
		function addtopaper2(qid){
			var rows = $("#dg2").datagrid("getRows");
			var row = findRow(rows,qid);
			var index = $("#dg2").datagrid("getRowIndex",row);
			var test = '<a href="#" onclick="showValue(' + index + ')">查看</a>&nbsp;<a href="#" onclick="deltopaper(' + row.qid + ','+row.qtype+')">取消添加</a>';
			row.test = test;
			$("#choosetb1").datagrid("appendRow",row);
			$("#dg2").datagrid("deleteRow",index);
		}
		function findRow(rows,qid){
			if(rows && qid){
				for(var i=0;i<rows.length;i++){
					if(qid== rows[i].qid){
						return rows[i];
					}
				}
			}
			return null;
		}
		function deltopaper(qid,qtype){
			if(qid&&qtype){
				var rows = $("#choosetb1").datagrid("getRows");
				var row = findRow(rows,qid);
				var index = $("#choosetb1").datagrid("getRowIndex",row);
				if(qtype == 1){
					var test = '<a href="#" onclick="showValue(' + row.qid + ')">查看</a>&nbsp;<a href="#" onclick="addtopaper1(' + row.qid + ')">添加到试卷</a>';
					row.test = test;
					$("#dg1").datagrid("appendRow",row);
				}else{
					var test = '<a href="#" onclick="showValue(' + row.qid + ')">查看</a>&nbsp;<a href="#" onclick="addtopaper2(' + row.qid + ')">添加到试卷</a>';
					row.test = test;
					$("#dg2").datagrid("appendRow",row);
				}
				$("#choosetb1").datagrid("deleteRow",index);
			}
		}
		
		function submitForm(){
			var param ="";
			var rows= $("#choosetb1").datagrid("getRows");
			if(!rows || rows.length<1){
				$.messager.alert('提示消息',"请选择试题！");
				return;
			}
			for(var i=0;i<rows.length;i++){
				param+="qid="+rows[i].qid;
				if(i!=rows.length-1){
					param+="&";
				}
			}
			var formparam = $('#ff').serialize()+"&"+param;
			$.post("/ExamOnline/paper/edit",formparam,function(r){
				$.messager.alert('提示消息', r);
			});
		}
	</script>

</html>